<!--
 * @Author: 贾博林 11457230+jabolin@user.noreply.gitee.com
 * @Date: 2023-03-29 10:14:13
 * @LastEditors: 贾博林 11457230+jabolin@user.noreply.gitee.com
 * @LastEditTime: 2023-03-31 09:52:00
 * @FilePath: \zs-grouting2\naive-ui-admin\src\modules\system\department\department.vue
 * @Description: 权限管理
-->
<template>
  <div class="page p-2">
    <BFCurd
      ref="bfCurd"
      :form="{ template: formState.template! }"
      :table="{ 
        rowKey: 'id',
        columns: [
          { type: 'selection'},
          { title: '权限名称', key: 'departmentName',},
          { title: '权限描述', key: 'departmentDesc',},
          { title: '创建时间', key: 'departmentLogo',},
        ],
        selectRowKeys: tableState.selectKeys!
      }"
      :r="r"
      :c="c"
      :u="u"
      :d="d"
      @page-btn-click="pageBtnClick"
    >
      <!-- <template #applicationLogo="{ rowData }">
        <n-image width="100" :src="rowData.applicationLogo" />
      </template> -->
    </BFCurd>
  </div>
</template>

<script setup lang="ts">
import {
  BFCurdExpose,
  BFCurdOperaBtn,
  PageBtnClickCallbackFn,
  PageBtnClickData
} from '@/components/bf-curd/src/bf-curd'
import { getUploadFiles, transformToUploadFileList } from '@/modules/common/common'
import { onMounted, ref } from 'vue'
import { Application } from './auth.controller'
import { r, c, u, d, tableState, formState, init, ApplicationService } from './auth.service'
import { NImage } from 'naive-ui'

const bfCurd = ref<BFCurdExpose<Application>>()
let _currentOpera = ''
init()
// ApplicationService.getDepartmentList()

const pageBtnClick = async (
  btn: BFCurdOperaBtn,
  e: PageBtnClickData<Application>,
  callBack?: PageBtnClickCallbackFn
) => {
  console.log(btn, e)
  switch (btn.opera) {
    case 'add':
      _currentOpera = 'add'
      bfCurd.value?.setFormData({ applicationLogo: [] })
      bfCurd.value?.showModal()
      break
    case 'edit': {
      _currentOpera = 'edit'
      let applicationLogo = transformToUploadFileList(e.rowData!.applicationLogo)
      bfCurd.value?.setFormData({ ...e.rowData, applicationLogo })
      bfCurd.value?.showModal()
      break
    }
    case 'delete':
      callBack!('d', { prompt: '你确定要删除此应用吗?', data: [e.rowData!.id] })
      break
    case 'bulk-delete':
      callBack!('d', { prompt: '你确定要删除这些应用嘛?', data: e.selectKeys })
      break
    case 'confirm': {
      let applicationLogo = getUploadFiles(e.formdata!.applicationLogo)[0] || ''
      let action = await callBack!(_currentOpera === 'add' ? 'c' : 'u', {
        ...e.formdata,
        applicationLogo
      })
      if (action) {
        bfCurd.value?.hideModal()
      }
      break
    }
  }
}

// 删除第几个按钮
onMounted(() => {
  bfCurd.value?.deletePageBtn('leftBtns', 2)
  bfCurd.value?.deletePageBtn('rightBtns', 0)
})
</script>

<style scoped lang="scss"></style>
